<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>后台</title>
		<link rel="stylesheet" href="/static/admin/css/dashicons.css">
		<link rel="stylesheet" href="/static/admin/css/style.css">
		<script src="/static/admin/js/jquery.2.1.4.min.js"></script>
	</head>
	<body>
		<div class="wrap wrap-category" >
			<h1>栏目管理</h1>
			<div class="tips"></div>
			<div class="box">
				<div class="box-body">
<!--					<form method="post" action="?token=d1d8da704cea56e9045df5ca761993c0">-->
						<table>
							<tr><th width="84">显示顺序</th><th>栏目名称</th><th width="120">操作</th></tr>
							<!-- 顶级栏目 -->
							{foreach $list as $key=>$v }
							<tr class="hover">
								<td class="center">
									<input type="text" class="s-num" name="save[1][sort]" value="{$v.id}">
								</td>
								<td>
									<input type="text" name="save[1][name]" value="{$v.name}" >
								</td>
								<td class="center">
									<a href="http://www.tp6cms.com/index.php/index/category/cp_category_edit.html?id={$v.id}">编辑</a>
									<a href="http://www.tp6cms.com/index.php/index/category/cp_category_del.html?id={$v.id}" class="jq-del">删除</a>
								</td>
							</tr>
							<!-- 子级栏目 -->
							{if isset($v.child)}
							{foreach $v.child as $vo }
							<tr class="hover">
								<td class="center">
									<input type="text" class="s-num" name="save[13][sort]" value="{$vo.sort}">
								</td>
								<td>
									<i class="icon-sub"></i>
									<input type="text" name="save[13][name]" value="{$vo.name}">
								</td>
								<td class="center">
									<a href="http://www.tp6cms.com/index.php/index/category/cp_category_edit.html?id={$vo.id}">编辑</a>
									<a href="http://www.tp6cms.com/index.php/index/category/cp_category_del.html?id={$vo.id}" class="jq-del">删除</a>
								</td>
							</tr>
							{/foreach}
							{/if}
							<tr>
								<td colspan="3">
									<i class="icon-sub-add"></i>
									<span class="jq-sub-add s-add"   data-id={$v.id}>
										<i class="icon-cross" ></i>
										<b>添加子栏目</b>
									</span>
								</td>
							</tr>
							{/foreach}
							<tr>
								<td colspan="3">
									<span class="jq-add s-add">
									<i class="icon-cross" ></i>
										<b>添加新栏目</b>
									</span>
								</td>
							</tr>
							<tr class="s-act"><td colspan="3"><input type="submit" name="save" value="提交更改"></td></tr>
						</table>
				</div>
			</div>
		</div>
		<script>
			(function () {
				var add_id = 0; //保存ID计数
				//添加新栏目
				$(".jq-add").click(function () {
					$(this).parents("tr").before('<tr class="hover"><td class="center">\
<input type="text" class="s-num"  data-sort="sort"  name="add[' + add_id + '][sort]"></td><td colspan="2">\
<input type="text"  data-name="name"  name="add[' + add_id + '][name]">\
<input type="hidden"  data-pid="pid" name="add[' + add_id + '][pid]" value="0">\
		<b class="jq-cancel">取消</b></td></tr>');
					++add_id;
				});
				//添加子栏目
				$(".jq-sub-add").click(function () {
					var id = $(this).attr("data-id");
					$(this).parents("tr").before('<tr class="hover"><td class="center">\
<input type="text" class="s-num"  data-sort="sort"  name="add[' + add_id + '][sort]"></td><td colspan="2">\
<i class="icon-sub"></i>\
<input type="text"   data-name="name" name="add[' + add_id + '][name]">\
<input type="hidden" data-pid="pid"   name="add[' + add_id + '][pid]" value="' + id + '">\
		<b class="jq-cancel">取消</b></td></tr>');
					++add_id;
				});

				//取消添加
				$(document).on("click", ".jq-cancel", function () {
					$(this).parents("tr").remove();
				});

				//删除前提示
				$(".jq-del").click(function () {
					return confirm("您确定要删除此栏目？");
				});
				//提交更改
				$('input[name="save"]').click(function (){
					let data=[];
					for(var i=add_id-1;i>=0;i--){
						if($(`[name="add[${i}][sort]"]`) != undefined){
							data.push({
								'sort': $(`[name="add[${i}][sort]"]`).val(),
								'name': $(`[name="add[${i}][name]"]`).val(),
								'p_id': $(`[name="add[${i}][pid]"]`).val(),
							})
						}
					}
					$.ajax({
						type:'POST',
						url:'http://www.tp6cms.com/index.php/index/category/cp_category_add',
						data:{
							data:data,
						},
						success:function (res){
							if(res.code == 0){
								alert(res.msg);
							}else{
								alert(res.msg);
							}
						}
					})
				})
			})();
		</script>
	</body>
</html>